<template>
<div>
    <v-header></v-header>
    <div class="header">
        I am header
    </div>
    <div class="tab">
        <div class="tab-item">
            <a v-link="{path:'/goods'}">商品</a>
        </div>
        <div class="tab-item">
            <a v-link="{path:'/ratings'}">评论</a>
        </div>
        <div class="tab-item">
            <a v-link="{path:'/seller'}">商家</a>
        </div>
    </div>
    <router-view></router-view>
</div>
</template>

<script type="text/ecmascript-6">
import header from 'components/header/header.vue'

export default {
    components: {
        'v-header': header
    },
    data() {
        return {
        seller: {}
        }
    },
    created() {
      this.classMap = ['decrease', 'discount', 'special', 'invoice', 'guarantee']
      this.$http.get('/api/seller').then((response) => {
        response = response.body
        this.seller = Object.assign({}, this.seller, response.data)
      })
    }
}

</script>

<style lang="less" rel="stylesheet/less">

.tab{
    display: flex;
    width:100%;
    height:40px;
    line-height:40px;
    .tab-item{
        flex:1;
        text-align: center;
        a{
            display: block;
        }
        .active{
            color:red;
        }
    }
}
</style>
